<!doctype html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>写文章 -博客管理系统</title>
    <link rel="stylesheet" type="text/css" href="/admin/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="/admin/css/style.css">
    <link rel="stylesheet" type="text/css" href="/admin/css/font-awesome.min.css">
    <link rel="apple-touch-icon-precomposed" href="/admin/images/icon/icon.png">
    <link rel="shortcut icon" href="/admin/images/icon/favicon.ico">
    <script src="/admin/js/jquery-2.1.4.min.js"></script>
    <script src="/ckeditor/ckeditor.js"></script>
    <script src="/admin/js/jquery.form.js"></script>
</head>

<body class="user-select" style="margin: 0px;padding: 0px;">
<div>
    <ul class="breadcrumb" style="margin: 0px;">
        <li>文章管理</li>
        <li>文章添加</li>
    </ul>
</div>
<br/>
<div class="row">
    <form id="f1" action="/back/article/add" method="post" class="add-article-form">
        <div style="color: red" align="center">${(info)!}</div>
        <div class="col-md-9">

            <div class="form-group">
                <label for="article-title" class="sr-only">标题</label>
                <input type="text" id="article-title" name="articleTitle" class="form-control" placeholder="在此处输入标题"
                       required autofocus autocomplete="off">
            </div>
            <div class="form-group">
                <label for="article-content" class="sr-only">内容</label>
                <textarea class="ckeditor" style="height: 350px;" name="articleContent"></textarea>
            </div>

        </div>
        <div class="col-md-3">

            <div class="add-article-box">
                <h2 class="add-article-box-title"><span>栏目</span></h2>
                <div class="add-article-box-content">
                    <#list (allCategory)! as category>
                    <ul class="category-list">
                        <li>
                            <label>
                                <input name="categoryId" type="radio" value="${(category.categoryId)!}" checked>
                                ${(category.categoryName)!} <em class="hidden-md">( 栏目ID: <span>${(category.categoryId)!}</span>
                                )</em></label>
                        </li>
                    </ul>
                </#list>
            </div>
        </div>

        <div class="add-article-box">
            <h2 class="add-article-box-title"><span>标题图片</span></h2>
            <div class="add-article-box-content">
                <input type="file" class="form-control" placeholder="点击按钮选择图片" id="upload" name="upload"
                       autocomplete="off" onchange="uploadImg()">
                <img src="" width="338" id="fileImg">
                <input type="hidden" name="articleImg" id="articleImg">
            </div>

        </div>
        <div class="add-article-box">
            <h2 class="add-article-box-title"><span>发布</span></h2>
            <div class="add-article-box-content">
                <p><label>站长推荐：</label><input type="radio" name="articleRecom" value="1" checked/>是 <input type="radio"
                                                                                                           name="articleRecom"
                                                                                                           value="-1"/>否
                </p>
                <p><label>是否发布：</label><input type="radio" name="articleMark" value="1" checked/>是 <input type="radio"
                                                                                                          name="articleMark"
                                                                                                          value="-1"/>否
                </p>
            </div>
            <div class="add-article-box-footer">
                <button class="btn btn-primary" type="submit" name="">发布</button>
            </div>
        </div>
</div>
</form>
</div>

<script src="/admin/js/bootstrap.min.js"></script>
<script src="/admin/js/admin-scripts.js"></script>
<script type="text/javascript">
    function uploadImg() {
        var options = {
            url: '/back/article/upload',
            type: 'post',
            success: function (data) {
                $("#fileImg").attr("src", data);
                $("#articleImg").val(data);
            }
        }
        $("#f1").ajaxSubmit(options);

    }

</script>
</body>
</html>
